<template>
  <div class="app-container calendar-list-container">
    <!-- <img :src="item.parameter" alt="" v-for="item in parameters" :key="item.systemId"> -->
    <el-carousel type="card" trigger="click" height="300px">
        <el-carousel-item v-for="item in parameters" :key="item.systemId">
          <img :src="item.parameter" alt="" style="max-height:500px;width:400px;">
        </el-carousel-item>
      </el-carousel>   
    <div v-for="(item,index) in parameters" :key="index">  
        <el-upload
          action=""
          class="upload-demo"
          :http-request="fileUploads"
          :limit="1"
          list-type="picture">
          <el-button size="small" type="primary" @click="getPicIndex(item.systemId, index)">点击上传</el-button>
          <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
        </el-upload>
    </div>
  </div>
    
  
</template>

<script>
import { getPicture, updPicture, fileUpload } from '@/api/system'
export default {
  name: 'system_address',
  data () {
    return {
        loading: {
            edit: false
        },
        file: [],
        parameters: [],
        currentIndex: 0,
        currentId: ''
    }
  },
  methods: {
    async updPicture (file) {
      console.log(file);
      const { data } = await updPicture({
        systemId: this.currentId,
        file
      })
      this.getParameter()
    },
    getPicIndex (systemId, index) { 
      this.currentIndex = index
      this.currentId = systemId
    },
    // 获取商城地址
    async getParameter(){
      const { data } = await getPicture()
      this.parameters = data
    },
    async fileUploads({file}) {
      try{
        const fd = new FormData()
        fd.append('file', file)
        fd.append('fileName', 'indexPic')
        const res = await fileUpload(fd)

        this.updPicture(res.data)
      } catch(error) {

      }
    },
    //修改商城地址
    async updateParameter(systemId){
        if(!this.query.parameter){
            this.$message.error('请输入内容');
            return
        }
        const { data } = await updPicture({
            systemId,
            file:this.pic
        })
        this.$message.success('修改成功')
    }

  },
  created(){
    this.getParameter();
  }
}
</script>

<style>

</style>
